const bg = document.querySelector('.bg');
const load = document.querySelector('.loading');
let loads = 0
let timer = setInterval(loading, 30)

function loading() {
    loads += 1
    if(loads > 99) {
        clearInterval(timer)
    }
    load.innerHTML = `${loads}%`
    load.style.opacity = sacle(loads, 0, 100, 1, 0)
    bg.style.filter = `blur(${sacle(loads, 0, 100, 30, 0)}px)`
}

const sacle = (num, in_min, in_max, out_min, out_max) => {
  return (num - in_min) * (out_max - out_min) / (in_max - in_min) + out_min // 线性缩放函数
}















// const bg = document.querySelector('.bg');
// const loading = document.querySelector('.loading-text');


// let load = 0
// let timer = setInterval(blurring, 30)

// function blurring() {
//     load += 1
//     if(load > 99) {
//         clearInterval(timer)
        
//     }
//     loading.innerHTML = `${load}%`
//     loading.style.opacity = sacle(load, 0, 100, 1, 0)
//     bg.style.filter = `blur(${sacle(load, 0, 100, 30, 0)}px)`
// }
// const sacle = (num, in_min, in_max, out_min, out_max) => {
//   return (num - in_min) * (out_max - out_min) / (in_max - in_min) + out_min
// } // 线性缩放函数